<template>
  <div class="user_Account">
      <Sheader :title="'账号管理'"></Sheader>
   
<van-cell-group inset @click="click">
  <van-field
    v-model="nickName"
    rows="1"
    autosize
    label="昵称"
  />
   <van-field
    v-model="introduce"
    autosize
    label="个性签名"
  />
   <van-field
    v-model="password"
    autosize
    label="修改密码"
  />
   <van-button round class="save-btn" color="#1baeae" type="primary" @click="save" block>保存</van-button>
    <van-button round class="save-btn" color="#1baeae" type="primary" @click="handleLogout" block>退出登录</van-button>
</van-cell-group>
  </div>
</template>

<script>
import Sheader from '../components/Header.vue'
import {reactive, toRefs, onMounted} from 'vue'
import { getUserInfo, logout } from '../service/user'
import { setLocal } from '../common/js/ustil'
export default {
  components:{
    Sheader
  },
  setup() {
    const state = reactive({
      nickName: '',
      introduce: '',
      password: ''
    })

    onMounted(async() => {
      const { data } = await getUserInfo()
      state.nickName = data.nickName
      state.introduce = data.introduceSign
    })

    const handleLogout = async () => {
    const { resultCode } = await logout()
    console.log(resultCode);
      if (resultCode == 200) {
        setLocal('token', '')
        window.location.href = '/home'
      }
    }
    return {
      ...toRefs(state),
      handleLogout
    }
  }
}
</script>

<style>
 .save-btn {
      width: 80%;
      margin: 20px auto ;
    }
</style>